<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <title>软件列表</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <link rel="stylesheet" href="/static/layuiadmin/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/static/layuiadmin/style/admin.css" media="all">
</head>
<body>

<div class="layui-fluid">
    <div class="layui-card">
        <form class="layui-form layui-card-header layuiadmin-card-header-auto" lay-filter="table-search">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">名称</label>
                    <div class="layui-input-inline">
                        <input type="text" name="name" placeholder="请输入" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">版本</label>
                    <div class="layui-input-inline">
                        <input type="text" name="version" placeholder="请输入" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">位数</label>
                    <div class="layui-input-inline">
                        <select name="bit">
                            <option value="">请选择</option>
                            <?php foreach(\app\common\model\Software::bit_datalist as $key => $val): ?>
                            <option value="<?=$key?>"><?=$val?></option>
                            <?php endforeach; ?>
                        </select>
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">分类</label>
                    <div class="layui-input-inline">
                        <select name="type">
                            <option value="">请选择</option>
                            <?php foreach(\app\common\model\Category::order('title', 'ASC')->column('title', 'name') as $key => $val): ?>
                            <option value="<?=$key?>"><?=$val?></option>
                            <?php endforeach; ?>
                        </select>
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">最新</label>
                    <div class="layui-input-inline">
                        <select name="latest">
                            <option value="">请选择</option>
                            <?php foreach(\app\common\model\Software::latest_datalist as $key => $val): ?>
                            <option value="<?=$key?>"><?=$val?></option>
                            <?php endforeach; ?>
                        </select>
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">废弃</label>
                    <div class="layui-input-inline">
                        <select name="discard">
                            <option value="">请选择</option>
                            <?php foreach(\app\common\model\Software::discard_datalist as $key => $val): ?>
                            <option value="<?=$key?>"><?=$val?></option>
                            <?php endforeach; ?>
                        </select>
                    </div>
                </div>
                <div class="layui-inline">
                    <button class="layui-btn layuiadmin-btn-list" lay-submit lay-filter="table-search">
                        <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
                    </button>
                </div>
            </div>
        </form>

        <div class="layui-card-body">
            <table id="table-list" lay-filter="table-list"></table>
        </div>
    </div>
</div>
<script type="text/html" id="header-toolbar">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" lay-event="add">添加</button>
        <button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="delete">删除</button>
        <button class="layui-btn layui-btn-sm layui-btn-warm" lay-event="discard">废弃</button>
    </div>
</script>
<script type="text/html" id="latest">
    <input type="checkbox" name="latest" value="{{d.id}}" lay-skin="switch" lay-text="是|否" lay-filter="latest" {{ d.latest == 1 ? 'checked' : '' }}>
</script>
<script type="text/html" id="toolbar">
    <div class="layui-btn-group">
        <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    </div>
</script>

<script src="/static/layuiadmin/layui/layui.js"></script>
<script>
    layui.config({
        base: '/static/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    }).use(['index', 'table'], function(){
        var table = layui.table
            ,form = layui.form;

        // 获取数据并渲染表格
        table.render({
            elem: '#table-list'
            ,url: location.href
            ,method: 'post'
            ,title: document.title
            ,id: 'table-list'
            ,toolbar: '#header-toolbar'
            ,defaultToolbar: ["filter", "exports", "print"]
            ,cols: [[
                {type: 'checkbox', fixed: 'left'}
                ,{field:'id', title: 'ID', width:90}
                ,{field:'name', title: '名称', width:250}
                ,{field:'version', title: '版本', width:90}
                ,{field:'bit', title: '位数', width:58}
                ,{field:'size', title: '大小', width:90}
                ,{field:'remark', title: '备注', width:270}
                ,{field:'type', title: '类型', width:120}
                ,{field:'latest', title: '最新', width:82, templet: '#latest'}
                ,{field:'discard_text', title: '废弃', width:68}
                ,{field:'update_time', title: '更新时间', width:120}
                ,{field:'release_date', title: '发布时间', width:112}
                ,{field:'options', title: '操作', width:68, toolbar: '#toolbar', fixed: 'right'}
            ]]
            ,where: form.getValue(null, layui.$('form[lay-filter="table-search"]'))
            ,limit: 20
            ,page: true
            ,height: 'auto'
        });

        table.on('toolbar(table-list)', function(obj){
            let checkStatus = table.checkStatus(obj.config.id);

            switch (obj.event) {
                // 添加
                case 'add':
                    layer.open({
                        type: 2
                        ,title: '添加'
                        ,content: "<?=url('add')?>"
                        ,area: ['600px', '500px']
                        ,btn: ''
                        ,maxmin: true
                        ,end: function () {
                            table.reload(obj.config.id);
                        }
                    });
                    break;
                // 删除
                case 'delete':
                    if (checkStatus.data.length == 0) {
                        layer.msg('请选择要操作的内容');
                        return ;
                    }

                    layer.confirm('确定要删除选中内容吗？', function (index) {
                        layer.close(index);

                        let id = [];
                        checkStatus.data.forEach(function (item) {
                            id.push(item.id);
                        });

                        layui.$.post("<?=url('delete')?>", {id: id}, function (result) {
                            if (0 == result.code) {
                                layer.msg(result.msg);
                                table.reload(obj.config.id);
                            } else {
                                layer.msg(result.msg);
                            }
                        });
                    });
                    break;
                // 废弃
                case 'discard':
                    if (checkStatus.data.length == 0) {
                        layer.msg('请选择要操作的内容');
                        return ;
                    }

                    layer.confirm('确定要废弃选中内容吗？<br/>废弃后，文件将删除，但数据库的记录会保留。', function (index) {
                        layer.close(index);

                        let loading = layer.load();

                        let id = [];
                        checkStatus.data.forEach(function (item) {
                            id.push(item.id);
                        });

                        layui.$.post("<?=url('discard')?>", {id: id}, function (result) {
                            layer.close(loading);
                            if (0 == result.code) {
                                layer.msg(result.msg);
                                table.reload(obj.config.id);
                            } else {
                                layer.msg(result.msg);
                            }
                        });
                    });

                    break;
            }
        });

        //监听搜索
        form.on('submit(table-search)', function(data){
            //执行重载
            table.reload('table-list', {
                where: data.field,
                page: {curr: 1}
            });

            return false;
        });

        table.on('tool(table-list)', function(obj){
            switch (obj.event) {
                case 'edit':
                    layer.open({
                        type: 2
                        ,title: '编辑'
                        ,content: "<?=url('edit')?>?id=" + obj.data.id
                        ,area: ['600px', '500px']
                        ,btn: ''
                        ,maxmin: true
                        ,end: function () {
                            // 重载表格
                            table.reload('table-list');
                        }
                    });
                    break;
            }
        });

        //监听性别操作
        form.on('switch(latest)', function(obj){
            let loading = layer.load();

            layui.$.post(
                "<?=url('editColumn')?>",
                {
                    id: this.value,
                    name: this.name,
                    value: obj.elem.checked ? 1 : 0
                },
                function (data) {
                    layer.close(loading);
                    layer.msg(data.msg);
                }
            );
        });

    });
</script>
</body>
</html>